/* 字体色 */
.color {
  &-primary {
    color: $color-primary;
  }

  &-success {
    color: $color-success;
  }

  &-warning {
    color: $color-warning;
  }

  &-danger {
    color: $color-danger;
  }

  &-title {
    color: $color-title;
  }

  &-primary-text {
    color: $color-primary-text;
  }

  &-secondary-text {
    color: $color-secondary-text;
  }
}

/* 字体 */
.font {
  &-size {
    &-12 {
      font-size: 12px;
    }
    &-14 {
      font-size: 14px;
    }
    &-16 {
      font-size: 16px;
    }
    &-18 {
      font-size: 18px;
    }
    &-20 {
      font-size: 20px;
    }
  }
  &-weight {
    &-lighter {
      font-weight: lighter;
    }
    &-normal {
      font-weight: normal;
    }
    &-bold {
      font-weight: bold;
    }
    &-bolder {
      font-weight: bolder;
    }
    &-100 {
      font-weight: 100;
    }
    &-200 {
      font-weight: 200;
    }
    &-300 {
      font-weight: 300;
    }
    &-400 {
      font-weight: 400;
    }
    &-500 {
      font-weight: 500;
    }
    &-600 {
      font-weight: 600;
    }
    &-700 {
      font-weight: 700;
    }
    &-800 {
      font-weight: 800;
    }
    &-900 {
      font-weight: 900;
    }
  }
}

/* 对齐 */
.text {
  &-left {
    text-align: left !important;
  }

  &-center {
    text-align: center !important;
  }

  &-right {
    text-align: right !important;
  }
}

/* 浮动 */
.float {
  &-left {
    float: left;
  }

  &-right {
    float: right;
  }
}

/* 清除浮动 */
.fix {
  zoom: 1;

  &:after {
    content: "";
    display: block;
    clear: both
  }
}

/* 间距 */
.margin {
  &-bottom {
    &-0x {
      margin-bottom: x-space(0);
    }

    &-1x {
      margin-bottom: x-space(1);
    }

    &-2x {
      margin-bottom: x-space(2);
    }

    &-3x {
      margin-bottom: x-space(3);
    }

    &-4x {
      margin-bottom: x-space(4);
    }

    &-5 {
      margin-bottom: x-space(5);
    }

    &-6x {
      margin-bottom: x-space(6);
    }

    &-7x {
      margin-bottom: x-space(7);
    }

    &-8x {
      margin-bottom: x-space(8);
    }
  }

  &-top {
    &-0x {
      margin-top: x-space(0);
    }

    &-1x {
      margin-top: x-space(1);
    }

    &-2x {
      margin-top: x-space(2);
    }

    &-3x {
      margin-top: x-space(3);
    }

    &-4x {
      margin-top: x-space(4);
    }

    &-5x {
      margin-top: x-space(5);
    }

    &-6x {
      margin-top: x-space(6);
    }

    &-7x {
      margin-top: x-space(7);
    }

    &-8x {
      margin-top: x-space(8);
    }
  }
}

/* 宽高 */
.full {
  &-width,
  &-wh {
    width: 100% !important;
  }

  &-height,
  &-wh {
    height: 100% !important;
  }
}